<!DOCTYPE HTML>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<body class="white-bg">
	<div class="wrapper wrapper-content animated fadeInRight ibox-content">
		<form class="form-horizontal m" id="form-resourcesData-edit"
			th:object="${resourcesData}">
			<input id="id" name="id" th:field="*{id}" type="hidden">
			<div class="form-group">
				<label class="col-sm-3 control-label">数据名称：</label>
				<div class="col-sm-8">
					<input id="name" name="name" th:field="*{name}"
						class="form-control" type="text">
				</div>
			</div>
			<div class="form-group"
				th:if="${resourcesType=='20A'||resourcesType=='10B'||resourcesType=='10H' ||resourcesType=='10G'||resourcesType=='20B' }">
				<label class="col-sm-3 control-label">连接地址：</label>
				<div class="col-sm-8">
					<input id="linkUrl" name="linkUrl" th:field="*{linkUrl}"
						class="form-control" type="text">
				</div>
			</div>

			<div class="form-group"
				th:if="${resourcesType=='10A'||resourcesType=='10H' ||resourcesType=='60A'||resourcesType=='10D'||resourcesType=='10E'||resourcesType=='10F'||resourcesType=='10H'||resourcesType=='80A'||resourcesType=='80B'||resourcesType=='80C'||resourcesType=='90A'||resourcesType=='90B'||resourcesType=='90C'||resourcesType=='90D'||resourcesType=='90E'||resourcesType=='90F'||resourcesType=='90G'||resourcesType=='90H'||resourcesType=='90I'||resourcesType=='90J'||resourcesType=='90K'||resourcesType=='90L'||resourcesType=='90M'}">
				<label class="col-sm-3 control-label">数据地址：</label>
				<div class="col-sm-8">
					<input id="url" name="url" th:field="*{url}" class="form-control"
						type="text">
				</div>
			</div>
			<div class="form-group" id="fileImg"
				th:if="${resourcesType=='10C'||resourcesType=='20A'||resourcesType=='40A' ||resourcesType=='30A'||resourcesType=='70A'||resourcesType=='70B'||resourcesType=='70C'||resourcesType=='70D'||resourcesType=='70E'||resourcesType=='70F'||resourcesType=='100A'||resourcesType=='20B'}">
				<label class="col-sm-3 control-label">图片：</label>
				<div class="col-sm-8">
					<input id="file" type="file" name="file" class="file-box"
						accept="image/*">
				</div>
				<div class="col-sm-8">
					<img id="image" width="100px" alt="" height="100" src=""
						onclick="showMaxImg(this)">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">数据排序：</label>
				<div class="col-sm-8">
					<input id="dataSort" name="dataSort" class="form-control"
						type="number" th:field="*{dataSort}">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">数据类型：</label>
				<div class="col-sm-8">
					<input id="type" name="type" th:field="*{type}"
						class="form-control" type="text" disabled="disabled">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">数据状态：</label>
				<div class="col-sm-8">
					<div class="radio-box"
						th:each="dict : ${@dict.getType('sys_status')}">
						<input type="radio" th:id="${dict.dictCode}" name="status"
							th:value="${dict.dictValue}" th:field="*{status}"> <label
							th:for="${dict.dictCode}" th:text="${dict.dictLabel}"></label>
					</div>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">创建人：</label>
				<div class="col-sm-8">
					<input id="createBy" name="createBy" th:field="*{createBy}"
						class="form-control" type="text" disabled="disabled">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">创建时间：</label>
				<div class="col-sm-8">
					<input id="createTime" name="createTime"
						th:value="${#dates.format(resourcesData.createTime, 'yyyy-MM-dd HH:mm:ss')}"
						class="form-control" type="text" disabled="disabled">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">更新人：</label>
				<div class="col-sm-8">
					<input id="updateBy" name="updateBy" th:field="*{updateBy}"
						class="form-control" type="text" disabled="disabled">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">更新时间：</label>
				<div class="col-sm-8">
					<input id="updateTime" name="updateTime"
						th:value="${#dates.format(resourcesData.updateTime, 'yyyy-MM-dd HH:mm:ss')}"
						class="form-control" type="text" disabled="disabled">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label">备注：</label>
				<div class="col-sm-8">
					<textarea id="remarks" name="remarks" class="form-control">[[*{remarks}]]</textarea>
				</div>
			</div>
		</form>
	</div>
	<div class="modal fade bs-example-modal-lg text-center" id="imgModal"
		tabindex="-1" role="dialog" data-toggle="modal"
		aria-labelledby="myLargeModalLabel" aria-hidden="true">
		<div class="modal-dialog modal-lg"
			style="display: inline-block; width: auto;">
			<div class="modal-content">
				<div id="imgshow"></div>
			</div>
		</div>
	</div>
	<div th:include="include::footer"></div>
	<script type="text/javascript">
		var prefix = ctx + "system/resourcesData"
		//图片预览路径
		document.getElementById('file').onchange = function() {
			var imgFile = this.files[0];
			var fr = new FileReader();
			fr.onload = function() {
				document.getElementById('image').src = fr.result;
			};
			fr.readAsDataURL(imgFile);
		};

		//点击放大图片
		function showMaxImg(obj) {
			var src = $(obj).attr("src");
			$("#imgModal")
					.find("#imgshow")
					.html(
							"<img src='" + src + "' class='carousel-inner img-responsive img-rounded' data-dismiss='modal'>");
			$("#imgModal").modal('show');
		}

		$("#form-resourcesData-edit").validate({
			rules : {
				name : {
					required : true,
				},
				url : {
					required : true,
				},
				dataSort : {
					required : true,
				},
			}
		});

		function submitHandler() {
			if ($.validate.form()) {
				var formdata = new FormData();
				formdata.append("status", $("input[name='status']:checked")
						.val());
				formdata.append("id", $("#id").val());
				formdata.append("name", $("#name").val());
				if ($('#file').val() == undefined || $('#file').val() == null) {
					formdata.append('file', null);
				} else {
					formdata.append('file', $('#file').get(0).files[0]);
				}
				if ($("#url").val() == undefined || $("#url").val() == null) {
					formdata.append('url', "");
				} else {
					formdata.append('url', $("#url").val());
				}
				if ($("#linkUrl").val() == undefined
						|| $("#linkUrl").val() == null) {
					formdata.append('linkUrl', "");
				} else {
					formdata.append('linkUrl', $("#linkUrl").val());
				}
				formdata.append("dataSort", $("#dataSort").val());
				formdata.append("type", $("#type").val());
				formdata.append("remarks", $("#remarks").val());
				$.ajax({
					url : prefix + "/edit",
					data : formdata,
					type : "post",
					processData : false,
					contentType : false,
					success : function(result) {
						$.operate.saveSuccess(result);
					}
				})
			}

		}
	</script>
</body>
</html>
